<template>
	<section>
		<t-table v-bind="$attrs" v-on="$listeners">
			<template v-for="column in schema">
				<tiny-table-column-edit v-if="column.editable" v-bind="column" v-on="column.editEvents"/>
				<tiny-table-column v-else v-bind="column" />
			</template>
		</t-table>
		<t-row v-if="pagination" type="flex" justify="end" style="margin-top: 10px;">
			<t-pagination background layout="total, sizes, prev, pager, next, jumper" v-bind="paginationProps" v-on="paginationEvents"/>
		</t-row>
	</section>
</template>

<script>
import TinyTableColumn from './TinyTableColumn.vue';
import TinyTableColumnEdit from './TinyTableColumnEdit.vue';

export default {
	name: "TinyTable",
	components: {
		TinyTableColumn,
		TinyTableColumnEdit
	},
	props: {
		/**
		 * @description 表格数据
		 * @type {Array}
		 * @required true
		 */
		schema: {
			type: Array,
			default: () => []
		},
		pagination: {
			type: Boolean,
			default: false
		},
		paginationProps: {
			type: Object,
			default: () => ({})
		},
		paginationEvents: {
			type: Object,
			default: () => ({})
		}
	}
}
</script>